page {
    background-color: #F2F2F2;
}

.content {
    display: flex;
    flex-direction: column;
    justify-items: center;
    align-items: center;
}

.groupList {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-items: center;
    width: 100%;
}

.groupRoute {
    display: flex;
    flex-direction: column;
    margin-top: 40rpx;
    width: 90%;
    padding-bottom: 30rpx;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
    border-radius: 30rpx;
    overflow: auto;
    background-color: white;
}

.groupTitle {
    flex: 1;
    display: flex;
    align-items: center;
    max-height: 100rpx;
    min-height: 100rpx;
    background-color: #4186F5;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

.groupNum {
    margin: 0rpx 30rpx;
    font-size: 35rpx;
    font-weight: 400;
    font-family: '黑体';
    color: white;
}

.title {
    margin-left: 20%;
    font-size: 35rpx;
    font-weight: 400;
    font-family: '黑体';
    color: white;
}

.routeList {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin: 10rpx 0rpx;
}

.routeItem {
    /* margin-top: 20rpx; */
    width: 100%;
    height: 100rpx;
    display: flex;
    align-items: center;
    border-radius: 15rpx;
}

.routebox {
    margin-top: 20rpx;
    width: 94%;
    height: 100rpx;
    display: flex;
    align-items: center;
    border-radius: 15rpx;
}

.routeIndex {
    margin: 20rpx 10rpx 20rpx 30rpx;
    width: 40rpx;
    height: 40rpx;
    line-height: 40rpx;
    text-align: center;
    border-radius: 50rpx;
}

.completedIndex {
    border: #FF9802 solid 1px;
    color: #FF9802;
}

.progressIndex {
    border: #4186F5 solid 1px;
    color: #4186F5;
}

.routeName {
    margin-left: 10rpx;
    font-family: '宋体';
    flex: 1;
    font-size: 30rpx;
}

.status {
    margin-right: 20rpx;
    font-family: '宋体';
}

.completedBg {
    background-color: #FFF9F0;
}

.progressBg {
    background-color: #E9F4FF;
}
